.app-container {
    .header {
        margin-top: -10px;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .el-date-editor.el-input,
        .el-date-editor.el-input__inner {
            width: 220px;
            margin-right: 20px;
        }
        .backB{
            cursor: pointer;
            img{
                width: 20%;
            }
        }
        // ::v-deep .el-button--primary {
        //     color: #FFFFFF;
        //     background-color: #74b9ff;
        //     border-color: #74b9ff;
        // }
    }
    .title1{
        font-size: 16px;
        margin-bottom: 15px;
        color: #808080;
        width: 200px;
        padding: 5px;
        border-bottom: 1px dotted #8ddfff;
    }    
    .title {
        font-size: 16px;
        margin-bottom: 15px;
        color: #808080;
        width: 170px;
        padding: 5px;
        border-bottom: 1px dotted #8ddfff;
    }
    .el-icon-data-analysis::before {
        color: #00d9ff;
        margin-right: 8px;
    }
    .el-icon-data-board::before {
        color: #00d9ff;
        margin-right: 8px;
    }

    .el-icon-data-line::before {
        color: #00d9ff;
        margin-right: 8px;
    }
    .boxContent1{
        color: #ffffff;
        width: 95.8%;
        height: 70px;
        display: flex;
        padding: 20px 70px;
        justify-content:space-between;
        align-items: center;
        margin-bottom: 10px;
        border-radius: 5px;
        background: linear-gradient(to right, #008886, #00cec9);
        // background: #00cec9;
            .one {
                display: flex;
                justify-content: space-between;

                span:nth-child(1) {
                    display: inline-block;
                    width: 180px;
                }

                span:nth-child(2) {
                    font-size: 20px;
                    font-weight: 700;
                }
            }
    }
    .boxContent {
        width: 100%;
        height: 490px;
        display: flex;
        justify-content: flex-start;
        margin-bottom: 20px;

        .item1 {
            color: #ffffff;
            padding: 20px 50px;
            font-size: 14px;
            width: 30%;
            height: 100%;
            // background: linear-gradient(to right, #f9a13f, #fec05a);
            // box-shadow: 0 10px 8px -5px rgba($color: #fcb868, $alpha: 0.9);
            background: linear-gradient(to right, #03a6a6, #81ecec);
            box-shadow: 0 10px 8px -5px rgba($color: #39aaaa, $alpha: 0.9);
            border-radius: 5px;
            margin-right: 50px;

            div {
                margin-bottom: 20px;
            }

            .hname {
                font-weight: 700;
                margin-bottom: 10px;
                height: 30px;
                width: 180px;
            }

            .one {
                padding: 0 15px;
                display: flex;
                justify-content: space-between;

                span:nth-child(1) {
                    display: inline-block;
                    width: 220px;
                    border-right: 1px dotted #ffffff;
                }

                span:nth-child(2) {
                    font-size: 20px;
                    font-weight: 700;
                }
            }
        }

        .item2 {
            color: #ffffff;
            padding: 20px 50px;
            font-size: 14px;
            width: 30%;
            height: 100%;
            // background: linear-gradient(to right, #5099ee, #4dc0e9);
            // box-shadow: 0 10px 8px -5px rgba($color: #72b2ef, $alpha: 0.9);
            background: linear-gradient(to right, #2a82db, #74b9ff);
            box-shadow: 0 10px 8px -5px rgba($color: #306fb0, $alpha: 0.9);
            border-radius: 5px;
            margin-right: 50px;

            div {
                margin-bottom: 20px;
            }

            .hname {
                font-weight: 700;
                margin-bottom: 10px;
                height: 30px;
                width: 180px;
            }

            .one {
                padding: 0 15px;
                display: flex;
                justify-content: space-between;

                span:nth-child(1) {
                    display: inline-block;
                    width: 220px;
                    border-right: 1px dotted #ffffff;
                }

                span:nth-child(2) {
                    font-size: 20px;
                    font-weight: 700;
                }
            }
        }

        .item3 {
            color: #ffffff;
            padding: 20px 50px;
            font-size: 14px;
            width: 30%;
            height: 100%;
            // background: linear-gradient(to right, #19b7a6, #3dd1ad);
            // box-shadow: 0 10px 8px -5px rgba($color: #49c6b7, $alpha: 0.9);
            background: linear-gradient(to right, #7067e6, #a29bfe);
            box-shadow: 0 10px 8px -5px rgba($color: #5349d5, $alpha: 0.9);
            border-radius: 5px;

            div {
                margin-bottom: 20px;
            }

            .hname {
                font-weight: 700;
                margin-bottom: 10px;
                height: 30px;
                width: 80px;
            }

            .one {
                padding: 0 15px;
                display: flex;
                justify-content: space-between;

                span:nth-child(1) {
                    display: inline-block;
                    width: 220px;
                    border-right: 1px dotted #ffffff;
                }

                span:nth-child(2) {
                    font-size: 20px;
                    font-weight: 700;
                }
            }
        }
    }

    .tableContent {
        width: 95.8%;
        margin-bottom: 20px;
        .wtable {
            margin-top: 18px;
        }
    }
}